import React, { memo, useState, useEffect } from "react";
import { View, Text, StyleSheet, Image } from "react-native";
import { p } from "utils/pxToDp";
import { LinearGradient } from "expo-linear-gradient";
import themeStore from "stores/theme";
import YText from "components/YText";
import commonStyle from "utils/style";

const Vip = () => {
  const theme = themeStore.theme;
  return (
    <LinearGradient
      colors={[
        theme.gradientp1,
        theme.gradientp2,
        theme.gradientp3,
        theme.gradientcomment,
      ]}
      style={styles.box}
    >
      <View>
        <View
          style={[
            commonStyle.flexrow,
            commonStyle.flexrowaligncenter,
            commonStyle.mb20,
          ]}
        >
          <Image
            source={require("assets/vip-icon.png")}
            style={styles.hearticon}
          />
          <YText color={theme.mainText} size={theme.f28} bold>
            会员特权
          </YText>
        </View>
        <View 
        // style={[commonStyle.mt20]}
        >
          {/* <View
            style={[
              styles.vipitem,
              {
                backgroundColor: theme.itembg,
              },
            ]}
          >
            <YText color={theme.mainText} size={theme.f22}>
              解锁换肤功能
            </YText>
          </View>
          <View
            style={[
              styles.vipitem,
              {
                backgroundColor: theme.itembg,
              },
            ]}
          >
            <YText color={theme.mainText} size={theme.f22}>
              解锁日记
            </YText>
          </View> */}
        </View>
      </View>
    </LinearGradient>
  );
};

const styles = StyleSheet.create({
  box: {
    marginTop: p(20),
    padding: p(25),
    borderRadius: p(25),
    shadowColor: "#ffffff",
    shadowOffset: { width: 0, height: 0 },
    shadowOpacity: 0.5,
    shadowRadius: p(25),
    elevation:p(25),
    width: "48%",
    height: p(300),
    // paddingBottom: p(10),
  },
  hearticon: {
    width: p(40),
    height: p(40),
    marginRight: p(10),
  },
  vipitem: {
    borderRadius: p(15),
    shadowColor: "#000",
    shadowOffset: { width: 0, height: 0 },
    shadowOpacity: 0.1,
    shadowRadius: p(5),
    elevation:p(5),
    paddingVertical:p(15),
    paddingHorizontal:p(15),
    marginTop:p(20)
  },
});

export default Vip;
